<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        *{
            padding: 0;
            margin: 0;
        }
    
        .out{
            width: 960px;
            height: 1024px;
            border: 1px red solid;
            margin: 0pa auto;
        }


    </style>
</head>
<body>
    <!-- 
       定位： position  （特点: 就是找对参考点）
         四个值：  1 static  静态  默认的
                  2  relative  相对定位 
                      相对定位 又称自私定位  
                      它的参考点： 原来所在位置的左上角   
                  3 absolute  绝对定位
                  绝对定位 又称无私定位
                  它的参考点: 离它最近的那个父元素，有定位属性的那个元素的左上角,
                            如果没有定位属性则继续往返上找，找到body元素结束

                  4 fixed    固定定位   
                 
                  它的参考点: 永远都是以body元素的左上角
                  
     -->
    
       <div class="out"> 
           <div class="guanggao">广告xxxxxx</div>
       </div>

</body>
</html>